<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <title>分组管理</title>
    <meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no'
          name='viewport'/>
    <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
    <link rel="stylesheet"
          href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i">
    <link rel="stylesheet" href="/assets/css/ready.css">
    <link rel="stylesheet" href="/assets/css/demo.css">
    <link rel="stylesheet" href="/assets/css/mystyle.css">
</head>
<body>
<div class="wrapper">
    <div th:replace="~{index::topbar}"></div>
    <div th:replace="~{index::sidebar(activeUri = '/group/manager')}"></div>
    <div class="main-panel">
        <div class="content">
            <div class="container-fluid">
                <h4 class="page-title">添加分组</h4>
                <div class="row">
                    <div class="col-md-12">
                        <div class="card">
                            <div class="card-body">
                                <div class="float-right">
                                    <div class="col-md-3">
                                        <button class="btn btn-primary" id="groupAdd" data-toggle="modal" data-target="#GroupAddModal">新增分组</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12">
                        <div class="card">
                            <div class="card-header">
                                <div class="card-title text-center">组列表</div>
                            </div>
                            <div class="card-body">
                                <table class="table table-hover">
                                    <thead>
                                    <tr>
                                        <th scope="col" class="text-md-center">组ID</th>
                                        <th scope="col" class="text-md-center">组名</th>
                                        <th scope="col" class="text-md-center">可查看区</th>
                                        <th scope="col" class="text-md-center">可查看数据分析</th>
                                        <th scope="col" class="text-md-center">可上传报表</th>
                                        <th scope="col" class="text-md-center">可设置阈值</th>
                                        <th scope="col" class="text-md-center">可设置报警</th>
                                        <th scope="col" class="text-md-center">可发布通知</th>
                                        <th scope="col" class="text-md-center">操作</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr th:each="Group,iterStat:${group}">
                                        <td class="text-md-center" th:text="${Group.groupID}"></td>
                                        <td class="text-md-center" th:text="${Group.groupName}"></td>
                                        <td class="text-md-center" th:text="${Group.domainName}"></td>
                                        <!--<td class="text-md-center">
                                            <div th:each="Domain,iterStat:${domain}">
                                                <p th:if="${Group.domainID==Domain.domainID}" th:text="${Domain.domainName}"></p>
                                            </div>
                                        </td>-->
                                        <td class="text-md-center">
                                            <div th:switch="${Group.isAnalysis}">
                                                <i th:case="1" class="la la-check" style="color: green" th:value="${Group.isAnalysis}"></i>
                                                <i th:case="0" class="la la-close" style="color: red" th:value="${Group.isAnalysis}"></i>
                                            </div>
                                        </td>
                                        <td class="text-md-center">
                                            <div th:switch="${Group.isUpload}">
                                                <i th:case="1" class="la la-check" style="color: green" th:value="${Group.isUpload}"></i>
                                                <i th:case="0" class="la la-close" style="color: red" th:value="${Group.isUpload}"></i>
                                            </div>
                                        </td>
                                        <td class="text-md-center">
                                            <div th:switch="${Group.isThreshold}">
                                                <i th:case="1" class="la la-check" style="color: green" th:value="${Group.isThreshold}"></i>
                                                <i th:case="0" class="la la-close" style="color: red" th:value="${Group.isThreshold}"></i>
                                            </div>
                                        </td>
                                        <td class="text-md-center">
                                            <div th:switch="${Group.isAlarm}">
                                                <i th:case="1" class="la la-check" style="color: green" th:value="${Group.isAlarm}"></i>
                                                <i th:case="0" class="la la-close" style="color: red" th:value="${Group.isAlarm}"></i>
                                            </div>
                                        </td>
                                        <td class="text-md-center">
                                            <div th:switch="${Group.isNotice}">
                                                <i th:case="1" class="la la-check" style="color: green" th:value="${Group.isNotice}"></i>
                                                <i th:case="0" class="la la-close" style="color: red" th:value="${Group.isNotice}"></i>
                                            </div>
                                        </td>
                                        <td class="text-md-center" th:if="${Group.groupID}!=0">
                                            <button class="btn btn-primary editGroupBtn" data-toggle="modal" data-target="#UpdateGroup">修改</button>
                                            <button class="btn btn-danger delGroupBtn" data-toggle="modal" data-target="#DeleteGroup" th:attr="del_uri=@{/group/delete/}+${Group.groupID}">删除</button></td>
                                    </tr>

                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <form id="deleteGroupForm" method="post">
                    <input type="hidden" name="_method" value="delete"/>
                </form>
            </div>
        </div>
        <div th:replace="~{index::footer}"></div>
    </div>
</div>
</div>
<!--GroupAddModal-->
<div class="modal fade" id="GroupAddModal" tabindex="-1" role="dialog" aria-labelledby="modalUpdatePro" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header bg-primary">
                <h6 class="modal-title"><i class="la la-frown-o"></i> 添加分组</h6>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <form id="addForm" method="post" action="/group/add">
                    <div class="row">
                        <div class="col-sm-3"></div>
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label for="GroupInputName">组名：</label>
                                <input type="text" class="form-control" placeholder="组名" name="groupName" id="GroupInputName">
                            </div>
                            <div class="form-group middle">
                                <label>权限设置：</label>
                                <div>
                                    <select id="addGroupSelect">
                                        <option th:each="Domain,iterStat:${domain}" th:value="${Domain.domainID}" th:text="${Domain.domainName}"></option>
                                    </select>
                                </div>
                                <div>
                                    <label class="form-check-label">
                                        <input class="form-check-input" type="checkbox" value="" name="IsAnalysis">
                                        <span class="form-check-sign">可数据分析</span>
                                    </label>
                                </div>
                                <div>
                                    <label class="form-check-label">
                                        <input class="form-check-input" type="checkbox" value="" name="IsUpload">
                                        <span class="form-check-sign">可上传报表</span>
                                    </label>
                                </div>
                                <div>
                                    <label class="form-check-label">
                                        <input class="form-check-input" type="checkbox" value="" name="IsThreshold">
                                        <span class="form-check-sign">可设置阈值</span>
                                    </label>
                                </div>
                                <div>
                                    <label class="form-check-label">
                                        <input class="form-check-input" type="checkbox" value="" name="IsNotice">
                                        <span class="form-check-sign">可发布通知</span>
                                    </label>
                                </div>
                                <div>
                                    <label class="form-check-label">
                                        <input class="form-check-input" type="checkbox" value="" name="IsAlarm">
                                        <span class="form-check-sign">可设置报警</span>
                                    </label>
                                </div>
                            </div>
                            <div class="well center-block">
                                <button type="button" class="btn btn-primary" id="addSubmit">提交</button>
                                <button type="button" class="btn btn-default" data-dismiss="modal" aria-label="Close">取消</button>
                            </div>
                        </div>
                        <div class="col-sm-3"></div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>
<!--UpdateGroup-->
<div class="modal fade" id="UpdateGroup" tabindex="-1" role="dialog" aria-labelledby="modalUpdatePro" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header bg-primary">
                <h6 class="modal-title"><i class="la la-frown-o"></i> 添加分组</h6>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <form id="updateForm" method="post">
                    <div class="row">
                        <div class="col-sm-3"></div>
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label for="editGroupName">组名：</label>
                                <input type="text" class="form-control" placeholder="组名" name="groupName" id="editGroupName">
                            </div>
                            <div class="form-group middle">
                                <label>权限设置：</label>
                                <div>
                                    <select id="selectGroup">
                                        <option th:each="Domain,iterStat:${domain}" th:value="${Domain.domainID}" th:text="${Domain.domainName}"></option>
                                    </select>
                                </div>
                                <div>
                                    <label class="form-check-label">
                                        <input class="form-check-input" type="checkbox" value="" id="IsAnalysis">
                                        <span class="form-check-sign">可数据分析</span>
                                    </label>
                                </div>
                                <div>
                                    <label class="form-check-label">
                                        <input class="form-check-input" type="checkbox" value="" id="IsUpload">
                                        <span class="form-check-sign">可上传报表</span>
                                    </label>
                                </div>
                                <div>
                                    <label class="form-check-label">
                                        <input class="form-check-input" type="checkbox" value="" id="IsThreshold">
                                        <span class="form-check-sign">可设置阈值</span>
                                    </label>
                                </div>
                                <div>
                                    <label class="form-check-label">
                                        <input class="form-check-input" type="checkbox" value="" id="IsNotice">
                                        <span class="form-check-sign">可发布通知</span>
                                    </label>
                                </div>
                                <div>
                                    <label class="form-check-label">
                                        <input class="form-check-input" type="checkbox" value="" id="IsAlarm">
                                        <span class="form-check-sign">可设置报警</span>
                                    </label>
                                </div>
                            </div>
                            <div class="well center-block">
                                <button type="button" class="btn btn-primary" id="groupUpdate">提交</button>
                                <button type="button" class="btn btn-default">取消</button>
                            </div>
                        </div>
                        <div class="col-sm-3"></div>
                    </div>
                </form>
            </div>
            <!--<div class="modal-footer">-->
                <!--<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>-->
            <!--</div>-->
        </div>
    </div>
</div>
<!--DeleteGroupModal-->
<div class="modal fade" tabindex="-1" role="dialog" id="DeleteGroup">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h6 class="modal-title">确认删除</h6>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            </div>
            <div class="modal-body text-center">
                <p>确认删除该组？</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" id="delConfirm">确认</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</body>
<script src="/assets/js/core/jquery.3.2.1.min.js"></script>
<script src="/assets/js/plugin/jquery-ui-1.12.1.custom/jquery-ui.min.js"></script>
<script src="/assets/js/core/popper.min.js"></script>
<script src="/assets/js/core/bootstrap.min.js"></script>
<script src="/assets/js/plugin/chartist/chartist.min.js"></script>
<script src="/assets/js/plugin/chartist/plugin/chartist-plugin-tooltip.min.js"></script>
<script src="/assets/js/plugin/bootstrap-notify/bootstrap-notify.min.js"></script>
<script src="/assets/js/plugin/bootstrap-toggle/bootstrap-toggle.min.js"></script>
<script src="/assets/js/plugin/jquery-mapael/jquery.mapael.min.js"></script>
<script src="/assets/js/plugin/jquery-mapael/maps/world_countries.min.js"></script>
<script src="/assets/js/plugin/chart-circle/circles.min.js"></script>
<script src="/assets/js/plugin/jquery-scrollbar/jquery.scrollbar.min.js"></script>
<script src="/assets/js/ready.min.js"></script>
<script src="/assets/js/demo.js"></script>
<script src="/assets/layer/layer.js"></script>
<script src="/assets/js/my.js"></script>
<script th:src="@{/assets/js/grouplist.js}"></script>

</html>